<template>
  <el-dialog title="编辑学生" :visible.sync="isEditStudent" width="40%" :before-close="handleClose" :close-on-click-modal='false'>
    <el-form ref="form" :model="form" label-width="80px" label-position="top" size="small" :rules="rules">
      <el-tabs v-model="activeName">
        <el-tab-pane label="用户管理" name="basic">
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="姓名：" prop="real_name">
                <el-input v-model="form.real_name"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="性别：" prop="sex">
                <el-select v-model="form.sex" placeholder="请选择性别">
                  <el-option v-for="item in sexList" :key="'sex'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="账号：" prop="t_id">
                <el-input v-model="form.t_id" :disabled="true"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="密码：">
                <el-col :span="18" :xl="{span: 20}">
                  <el-input v-if="isResetPassWord === false" type="password" v-model="form.pwd"></el-input>
                  <el-input v-else type="text" v-model="form.pwd"></el-input>
                </el-col>
                <el-col :span="3" :xl="{span: 4}">
                  <el-button type="text" @click="resetPassWord">重置密码</el-button>
                </el-col>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="学籍号：">
                <el-input v-model="form.student_id"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="生日：">
                <el-date-picker v-model="form.birthday" type="date" placeholder="选择出生日期" format="yyyy 年 MM 月 dd 日" value-format="yyyy-MM-dd"> </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="所属层级：">
                <el-cascader :options="optionsList" v-model="form.options" :props="{value:'id',label:'title',children:'children'}" placeholder="请选择层级"> </el-cascader>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="状态：" prop="flag">
                <el-select v-model="form.flag" placeholder="请选择状态">
                  <el-option v-for="item in flagList" :key="'flag'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="家庭信息" name="family">
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="你是否为独生子女：">
                <el-radio-group v-model="form.only_child">
                  <el-radio v-for="item in only_childList" :key="'only_child'+item.id" :label="item.id">{{item.name}}</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20" v-if="form.only_child === 2">
            <el-col :span="12">
              <el-form-item label="你家有几个孩子：">
                <el-select v-model="form.list_which" placeholder="请选择你家有几个孩子">
                  <el-option v-for="item in this.selectList.child_num" :key="'child'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="所有孩子中你排第几：">
                <el-select v-model="form.child_num" placeholder="请选择所有孩子中你排第几">
                  <el-option v-for="item in this.selectList.list_which" :key="'child'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="父亲受教育程度：">
                <el-select v-model="form.father_education" placeholder="请选择父亲受教育程度">
                  <el-option v-for="item in this.selectList.father_education" :key="'father'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="父亲的职业：">
                <el-select v-model="form.dimness_cause_father" placeholder="请选择父亲的职业">
                  <el-option v-for="item in this.selectList.dimness_cause_father" :key="'father'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="父亲月收入（元）：">
                <el-select v-model="form.monthly_profit_father" placeholder="请选择父亲月收入">
                  <el-option v-for="item in this.selectList.monthly_profit_father" :key="'father'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="父亲希望你完成的学历：">
                <el-select v-model="form.father_hope_education" placeholder="请选择父亲希望你完成的学历">
                  <el-option v-for="item in this.selectList.father_education" :key="'father'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="母亲受教育程度：">
                <el-select v-model="form.mother_education" placeholder="请选择母亲受教育程度">
                  <el-option v-for="item in this.selectList.mother_education" :key="'mother'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="母亲的职业：">
                <el-select v-model="form.dimness_cause_mother" placeholder="请选择母亲的职业">
                  <el-option v-for="item in this.selectList.dimness_cause_mother" :key="'mother'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="母亲月收入（元）：">
                <el-select v-model="form.monthly_profit_mother" placeholder="请选择母亲月收入">
                  <el-option v-for="item in this.selectList.monthly_profit_mother" :key="'mother'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="母亲希望你完成的学历：">
                <el-select v-model="form.mother_hope_education" placeholder="请选择母亲希望你完成的学历">
                 <el-option v-for="item in this.selectList.mother_hope_education" :key="'mother'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="父母的婚姻状况：">
                <el-select v-model="form.marital_status" placeholder="请选择父母的婚姻状况">
                 <el-option v-for="item in this.selectList.marital_status" :key="'parents'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="你认为你能完成的学历：">
                <el-select v-model="form.you_can_complete_edu" placeholder="请选择你认为你能完成的学历">
                  <el-option v-for="item in this.selectList.you_can_complete_edu" :key="'you'+item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
        </el-tab-pane>
      </el-tabs>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="close()">取 消</el-button>
      <el-button type="primary" @click="checkFn()">确 定</el-button>
    </span>
  </el-dialog>
</template>
<script>
import {APIALLLIST, APIEDITSELECTS, APIEDITSTUDENT, APIPERSONALFILESTUDENTS} from '@/common/api.js'
export default {
  props: ['isEditStudent', 'rows'],
  data () {
    return {
      activeName: 'basic',
      isResetPassWord: false,
      form: {
        real_name: '',
        options: [],
        flag: '',
        sex: '',
        pwd: '',
        t_id: '',
        student_id: '',
        birthday: '',
        only_child: '',
        father_education: '',
        child_num: '',
        list_which: '',
        dimness_cause_father: '',
        mother_education: '',
        dimness_cause_mother: '',
        monthly_profit_mother: '',
        monthly_profit_father: '',
        marital_status: '',
        you_can_complete_edu: '',
        mother_hope_education: '',
        father_hope_education: ''
      },
      rules: {
        real_name: [
          { required: true, message: '请输入姓名', trigger: 'blur' }
        ],
        sex: [
          { required: true, message: '请选择性别', trigger: 'blur' }
        ],
        t_id: [
          { required: true, message: '请输入账号', trigger: 'blur' }
        ],
        flag: [
          { required: true, message: '请选择层级', trigger: 'blur' }
        ],
        only_child: [
          { required: true, message: '请选择是否为独生子', trigger: 'blur' }
        ]
      },
      optionsList: [],
      selectList: {},
      only_childList: [
        {id: 1, name: '是'},
        {id: 2, name: '否'}
      ],
      sexList: [
        {id: 1, name: '男'},
        {id: 2, name: '女'}
      ],
      flagList: [
        {id: 1, name: '在读'},
        {id: 2, name: '休学'},
        {id: 3, name: '离校'}
      ]
    }
  },
  created () {
    this.allList()
    this.tableDate()
  },
  methods: {
    tableDate () {
      APIPERSONALFILESTUDENTS({
        uid: this.rows.rows.uid
      }).then((res) => {
        if (res.status === 1) {
          this.form.flag = res.data.flag
          this.form.sex = res.data.sex
          this.form.options = [res.data.section_id, res.data.grade_id, res.data.class_id]
          this.form.real_name = res.data.real_name
          this.form.t_id = res.data.t_id
          this.form.student_id = res.data.student_id
          this.form.birthday = res.data.birthday === '0000-00-00' ? '' : res.data.birthday
          this.form.only_child = res.data.only_child
          this.form.father_education = Number(res.data.father_education.code) === 0 ? '' : Number(res.data.father_education.code)
          this.form.list_which = Number(res.data.list_which.code) === 0 ? '' : Number(res.data.list_which.code)
          this.form.child_num = Number(res.data.child_num.code) === 0 ? '' : Number(res.data.child_num.code)
          this.form.father_education = Number(res.data.father_education.code) === 0 ? '' : Number(res.data.father_education.code)
          this.form.dimness_cause_father = Number(res.data.dimness_cause_father.code) === 0 ? '' : Number(res.data.dimness_cause_father.code)
          this.form.mother_education = Number(res.data.mother_education.code) === 0 ? '' : Number(res.data.mother_education.code)
          this.form.dimness_cause_mother = Number(res.data.dimness_cause_mother.code) === 0 ? '' : Number(res.data.dimness_cause_mother.code)
          this.form.monthly_profit_mother = Number(res.data.monthly_profit_mother.code) === 0 ? '' : Number(res.data.monthly_profit_mother.code)
          this.form.monthly_profit_father = Number(res.data.monthly_profit_father.code) === 0 ? '' : Number(res.data.monthly_profit_father.code)
          this.form.marital_status = Number(res.data.marital_status.code) === 0 ? '' : Number(res.data.marital_status.code)
          this.form.child_num = Number(res.data.child_num.code) === 0 ? '' : Number(res.data.child_num.code)
          this.form.list_which = Number(res.data.list_which.code) === 0 ? '' : Number(res.data.list_which.code)
          this.form.you_can_complete_edu = Number(res.data.you_can_complete_edu.code) === 0 ? '' : Number(res.data.you_can_complete_edu.code)
          this.form.mother_hope_education = Number(res.data.mother_hope_education.code) === 0 ? '' : Number(res.data.mother_hope_education.code)
          this.form.father_hope_education = Number(res.data.father_hope_education.code) === 0 ? '' : Number(res.data.father_hope_education.code)
        } else {
          this.$message.error(res.msg)
          this.InIt()
        }
      }).catch((err) => {
        this.$message.error(err.msg)
      })
    },
    allList () {
      APIALLLIST().then((res) => {
        this.optionsList = res.data
      }).catch((err) => {
        this.$message.error(err.msg)
      })
      APIEDITSELECTS().then((res) => {
        this.selectList = res.data
      }).catch((err) => {
        this.$message.error(err.msg)
      })
    },
    resetPassWord () { // 重置密码
      this.isResetPassWord = true
      this.form.pwd = '123456'
    },
    handleClose () {
      this.$emit('noEditStudent')
    },
    close (type) {
      this.$emit('noEditStudent', type)
    },
    checkFn () {
      if (this.form.real_name === '') {
        this.$message.warning('姓名不能为空')
        return false
      }
      if (this.form.sex === '') {
        this.$message.warning('性别不能为空')
        return false
      }
      if (this.form.t_id === '') {
        this.$message.warning('账号不能为空')
        return false
      }
      if (this.form.options === []) {
        this.$message.warning('所属层级不能为空')
        return false
      }
      if (this.form.pwd === '') {
        this.$message.warning('密码不能为空')
        return false
      }
      this.submit()
    },
    submit () {
      APIEDITSTUDENT({
        uid: this.rows.rows.uid,
        real_name: this.form.real_name,
        sex: this.form.sex,
        birthday: this.form.birthday,
        student_id: this.form.student_id,
        // t_id: this.form.t_id,
        section_id: this.form.options[0],
        grade_id: this.form.options[1],
        class_id: this.form.options[2],
        flag: this.form.flag,
        pwd: this.form.pwd,
        only_child: this.form.only_child,
        father_education: this.form.father_education,
        dimness_cause_father: this.form.dimness_cause_father,
        mother_education: this.form.mother_education,
        dimness_cause_mother: this.form.dimness_cause_mother,
        monthly_profit_mother: this.form.monthly_profit_mother,
        monthly_profit_father: this.form.monthly_profit_father,
        marital_status: this.form.marital_status,
        child_num: this.form.child_num,
        list_which: this.form.list_which,
        you_can_complete_edu: this.form.you_can_complete_edu,
        mother_hope_education: this.form.mother_hope_education,
        father_hope_education: this.form.father_hope_education
      }).then((res) => {
        if (res.status === 1) {
          this.$message.success(res.msg)
          this.close(1)
        } else {
          this.$message.error(res.msg)
        }
      }).catch((err) => {
        this.$message.error(err.msg)
      })
    }
  }
}
</script>
